/**
* Created by ren on 2017/1/7.
*订单状态,订单状态（0：待支付；1：已支付(待消费、待发货)；2：待评价；3：已评价；4：待收货；5：已收货,
*/
<template>
  <div class='moreGoods'>
    <template v-if="_parentThis.buyChild==='parent'">
      <div class="tab">
        <ul>
          <li :class="{active:cutName==='sp'}" @click="cut('sp')">商城</li>
          <li :class="{active:cutName==='dt'}" @click="cut('dt')">定投</li>
          <li :class="{active:cutName==='jsj'}" @click="cut('jsj')">金生金</li>
        </ul>
      </div>
      <div class="content" v-if="goodsData.length!==0">
        <div class="sp" v-if="cutName==='sp'" style="padding-top: 42px">
          <div class="item" v-for="(item,index) in goodsData.content">
            <div class="t">订单编号：{{item.orderNo}}
              <span v-if="item.orderStatus===0">待支付</span>
              <span v-if="item.orderStatus===1">已支付</span>
              <span v-if="item.orderStatus===2">待评价</span>
              <span v-if="item.orderStatus===3">已评价</span>
              <span v-if="item.orderStatus===4">待收货</span>
              <span v-if="item.orderStatus===5">已收货</span>
            </div>
            <div class="goodses">
              <div class="goods" v-for="(item2,index2) in item.shopping"
                   style="height: 130px;padding: 20px 0;border-bottom: 1px solid #cccccc;margin: 0 10px">
                <img v-lazy="loadImg(item2.imgUrl)"
                     style="width: 90px;height: 90px;float: left;border: 1px solid #cccccc;margin-right: 20px">
                <div style="float:left;margin-right: 20px;margin-top: 10px">
                  <div class="name" :title="item2.shopName">{{item2.shopName}}</div>
                  <div style="font-size: 16px;color: #666666">
                    {{(item2.shopstandardVo.weight/1000).toFixed(2)}}x{{item2.buyNumber}}
                  </div>
                </div>
                <div class="desc">
                </div>
                <div style="float:right;font-size: 18px;color: #f05120;margin-top: 20px">¥<span style="font-size: 24px">{{(item2.shopstandardVo.shopPrice/100).toFixed(2).split('.')[0]}}</span>.{{(item2.shopstandardVo.shopPrice/100).toFixed(2).split('.')[1]}}
                </div>
              </div>
              <div class="total" style="padding-top: 40px;border-top: 1px solid #ccc">
              <span style="font-size: 16px;color:#e31818;"><span style="font-size: 20px">合计：</span>¥<span
                style="font-size: 20px">{{(item.buyPrice/100).toFixed(2).split('.')[0]}}</span>.{{(item.buyPrice/100).toFixed(2).split('.')[1]}} <span
                style="font-size: 14px">(运费:{{(item.orderVo.currentEms/100).toFixed(2)}}元 保价费:{{(item.orderVo.valuationPrice/100).toFixed(2)}}元 已使用金蛋抵扣{{(item.orderVo.useGoldBeanNum*0.02).toFixed(2)}}元)</span></span>
                <div class="btns" style="float: right;">
                  <button class="btn" style="border-color: #ff5e00;color: #ff5e00;margin-left: 30px"
                          v-if="item.orderStatus===4"
                          @click="consigned(item.orderNo)">
                    确定收货
                  </button>
                  <button class="btn" style="border-color: #ccc;color: #999;margin-left: 30px"
                          v-if="item.orderStatus===0" @click="cancelOrder(item.orderNo)">取消订单
                  </button>
                  <button class="btn" style="border-color: #ff9900;color: #ff9900;margin-left: 30px"
                          v-if="item.orderStatus===0"
                          @click="toOrderConfirm(item.orderNo,item.createTime,item.buyPrice,item.isRenew)">立即支付
                  </button>
                  <!-- <button class="btn" style="border-color: #ccc;color: #999;margin-left: 30px"
                           v-if="item.orderStatus!==0&&item.orderStatus!==1"
                           @click="toTrack(item.orderNo,item)">
                     查看物流
                   </button>-->
                  <button class="btn" style="border-color: #ff9900;color: #ff9900;margin-left: 30px"
                          v-if="item.orderStatus!==0&&item.orderStatus!==1&&item.isComment===0"
                          @click="toComment(index)">我要评价
                  </button>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="dt" v-if="cutName==='dt'" style="padding-top:34px">
          <template v-if="dtCutName==='parent'">
            <div style="margin-left:30px;font-size:24px;color:#333;margin-bottom:20px">总黄金：<span
              style="color:#e60012">{{(goodsData.totalGold/1000).toFixed(1)}}g</span></div>
            <div style="margin-left:30px;font-size:24px;color:#333;margin-bottom:30px">可提取黄金：<span
              style="color:#e60012">{{(goodsData.extractGold/1000.0).toFixed(1)}}g</span></div>
            <div class="item" v-for="(item,index) in goodsData.putinBuyRecords.content"
                 @click="toMoreDingTouDetail(item)">
              <div style="margin-bottom:10px">
                <span>{{item.productName}}</span>
                <span v-if="item.putinType==='day'"> 日定投</span>
                <span v-if="item.putinType==='month'">月定投</span>
                <span v-if="item.putinType==='week'">周定投</span>
                <span v-if="item.putinType==='year'">年定投</span>
              </div>
              <div style="color:#999999">{{item.startTime.substring(0,10)}}</div>
              <img src="../../assets/toright.png" style="float:right;margin-top:-40px">
            </div>
            <div class="paging-wrap">
              <div class="paging" v-if="goodsData!==''&&goodsData.putinBuyRecords.totalPages>1">
                <img src="../../assets/prev.png" style="float: left;margin-top: 23px;cursor: pointer" @click="prev">
                <div class="page" style="float: left">
                  <div v-for="(item,index) in goodsData.putinBuyRecords.totalPages"
                       v-if="goodsData.putinBuyRecords.totalPages<9"
                       :class="{active:index===nextPage}" @click="paging(index)">{{index+1}}
                  </div>
                  <template v-if="goodsData.putinBuyRecords.totalPages>8">
                    <template v-if="goodsData.putinBuyRecords.totalPages-9<nextPage">
                      <div v-for="(item,index) in goodsData.putinBuyRecords.totalPages"
                           v-if="index>goodsData.putinBuyRecords.totalPages-9"
                           :class="{active:index===nextPage}" @click="paging(index)">{{index+1}}
                      </div>
                    </template>
                    <template v-else>
                      <div v-for="(item,index) in goodsData.putinBuyRecords.totalPages"
                           v-if="index<5+goodsData.putinBuyRecords&&index>nextPage-1"
                           :class="{active:index===nextPage}"
                           @click="paging(index)">{{index+1}}
                      </div>
                      <div>……</div>
                      <div v-for="(item,index) in goodsData.putinBuyRecords.totalPages"
                           v-if="index>goodsData.putinBuyRecords.totalPages-3"
                           :class="{active:index===nextPage}" @click="paging(index)">{{index+1}}
                      </div>
                    </template>
                  </template>
                </div>
                <img src="../../assets/next.png" style="float: left;margin-top: 23px;cursor: pointer" @click="next">
                <div class="total">共{{goodsData.putinBuyRecords.totalPages}}页</div>
              </div>
            </div>
            <div class="btns" style="margin-left: 115px;">
              <button :class="{btn:true,disabled:goodsData.extractGold<10000}" :disabled="goodsData.extractGold<10000"
                      style="margin-right: 140px"
                      @click="zhuancun">转存
              </button>
              <button :class="{btn:true,disabled:goodsData.extractGold<1000}" :disabled="goodsData.extractGold<1000"
                      @click="toTqList">提取
              </button>
            </div>
          </template>
          <div class="dt-zc-jsj dt-child" v-if="dtCutName==='morezcJsj'">
            <MorezcJsj :_parentThis="this"></MorezcJsj>
          </div>
          <div class="dt-zc-jsjdetail dt-child" v-if="dtCutName==='dingtouXcList'">
            <DingtouXcList :_parentThis="this"></DingtouXcList>
          </div>
          <div class="dt-zc-success dt-child" v-if="dtCutName==='zcSuccess'">
            <ZCSuccess></ZCSuccess>
          </div>
        </div>
        <div class="jsj" v-if="cutName==='jsj'">
          <div class="item" v-for="(item,index) in goodsData.content" @click="tojsjDetail(item.id)">
            <div style="margin-bottom:10px"><span>{{item.kinsongoldvo.kinsonName}}</span></div>
            <div style="color:#999999">{{item.startTime.substr(0,10)}}</div>
            <img src="../../assets/toright.png" style="float:right;margin-top:-40px">
          </div>
        </div>
      </div>
      <div class="paging-wrap" v-if="cutName!=='dt'">
        <div class="paging" v-if="goodsData!==''&&goodsData.totalPages>1">
          <img src="../../assets/prev.png" style="float: left;margin-top: 23px;cursor: pointer" @click="prev">
          <div class="page" style="float: left">
            <div v-for="(item,index) in goodsData.totalPages"
                 v-if="goodsData.totalPages<9"
                 :class="{active:index===nextPage}" @click="paging(index)">{{index+1}}
            </div>
            <template v-if="goodsData.totalPages>9">
              <template v-if="goodsData.totalPages-9<nextPage">
                <div v-for="(item,index) in goodsData.totalPages" v-if="index>goodsData.totalPages-9"
                     :class="{active:index===nextPage}" @click="paging(index)">{{index+1}}
                </div>
              </template>
              <template v-else>
                <div v-for="(item,index) in goodsData.totalPages" v-if="index<5+nextPage&&index>nextPage-1"
                     :class="{active:index===nextPage}"
                     @click="paging(index)">{{index+1}}
                </div>
                <div>……</div>
                <div v-for="(item,index) in goodsData.totalPages" v-if="index>goodsData.totalPages-3"
                     :class="{active:index===nextPage}" @click="paging(index)">{{index+1}}
                </div>
              </template>
            </template>
          </div>
          <img src="../../assets/next.png" style="float: left;margin-top: 23px;cursor: pointer" @click="next">
          <div class="total">共{{goodsData.totalPages}}页</div>
        </div>
      </div>
      <div style="margin-top: 10px;position: absolute;top: 36px;right: 15px;font-size: 18px"
           v-if="cutName==='dt'||cutName==='jsj'">
        <span style="float:right;color:#e6760a;cursor: pointer" @click="cut('tqList')">查看提取记录？</span>
      </div>
    </template>
    <template v-if="_parentThis.buyChild==='dtTqRecord'">
      <DtTqRecord :parentThis='this'></DtTqRecord>
    </template>
    <div :class="{ball:true,disabled:!showServerAgreement}"
         style="width: 617px;height: 288px;background: white;z-index: 100;position: fixed;top: 0;margin-top: 15%">
      <div style="text-align: center;font-size: 28px;color:#333333;margin-top: 45px">您确定要转存？</div>
      <div class="btns">

        <button class="btn" style="margin-right: 100px;background: #cccccc" @click="canel">取消</button>
        <button class="btn" @click="toMorezcJsj">确定</button>
      </div>
    </div>
    <div class="overlayer" @touchmove.stop :class="{'show':showServerAgreement}">
    </div>
    <Notify :parentThis='this'></Notify>
  </div>
</template>

<script>
  import API from '../../api'
  import Notify from '../Notify'
  import DTDetail from './DTDetail'
  import DtTqRecord from './DtTqRecord'
  import MorezcJsj from './MorezcJsj'
  import DingtouXcList from './DingtouXcList'
  import ZCSuccess from './ZCSuccess'
  export default {
    name: 'moreGoods',
    components: {
      Notify,
      DTDetail,
      DtTqRecord,
      MorezcJsj,
      DingtouXcList,
      ZCSuccess
    },
    data: function () {
      return {
        cutName: 'sp',
        nextPage: 0,
        goodsData: '',
        notifyStatus: 2,
        data: [],
        dtCutName: 'parent',
        showServerAgreement: false,
        zcjsjDetailId: ''
      }
    },
    props: ['_parentThis'],
    methods: {
      loadImg: function (path) {
        return API.path + path
      },
      canel: function () {
        this.showServerAgreement = false
      },
      zhuancun: function () {
        this.showServerAgreement = true
      },
      cut: function (name) {
        this.nextPage = 0
        if (name === 'jsj' || name === 'dt' || name === 'sp') {
          this.cutName = name
        }
        this.goodsData = []
        this._parentThis.titHtml = '<span>购买记录</span>'
        switch (name) {
          case 'jsj':
            this._parentThis.buyChild = 'parent'
            this.KinsonBuyRecord()
            this._parentThis.titHtml = '<span>购买记录 > <span style="color: #f48315;">金生金</span></span>'
            break
          case 'dt':
            this._parentThis.buyChild = 'parent'
            this.dtCutName = 'parent'
            this.regularPutInRecord()
            this._parentThis.titHtml = '<span>购买记录 > <span style="color: #f48315;">定投</span></span>'
            break
          case 'tqList':
            this._parentThis.buyChild = 'dtTqRecord'
            if (this.cutName === 'jsj') {
              this._parentThis.titHtml = '<span>购买记录 > <span>金生金</span> > <span style="color: #f48315;">提取记录</span></span>'
            } else {
              this._parentThis.titHtml = '<span>购买记录 > <span>定投</span> > <span style="color: #f48315;">提取记录</span></span>'
            }
            break
          case 'sp':
            this._parentThis.buyChild = 'parent'
            this._parentThis.titHtml = '<span>购买记录 > <span style="color: #f48315;">商城</span></span>'
            this.shoppingRecord()
            break
        }
      },
      consigned (orderNo) {
        var a = window.confirm('是否确定收货？')
        if (a) {
          this.$http.post(API.consigned, {
            orderNo: orderNo
          }).then((ret) => {
            const result = ret.body
            if (result.code === 1) {
              this.notifyStatus = '1|' + result.message
              this.shoppingRecord()
            } else {
              this.notifyStatus = '0|' + result.message
            }
          }, (err) => {
            console.log(err)
          })
        }
      },
      paging: function (page) {
        this.nextPage = page
        switch (this.cutName) {
          case 'jsj':
            this.KinsonBuyRecord()
            break
          case 'dt':
            this.regularPutInRecord()
            break
          case 'sp':
            this.shoppingRecord()
            break
        }
      },
      prev: function () {
        if (this.nextPage > 0) {
          this.nextPage = this.nextPage - 1
          switch (this.cutName) {
            case 'jsj':
              this.KinsonBuyRecord()
              break
            case 'dt':
              this.regularPutInRecord()
              break
            case 'sp':
              this.shoppingRecord()
              break
          }
        }
      },
      next: function () {
        if (this.nextPage < this.goodsData.totalPages - 1) {
          this.nextPage = this.nextPage + 1
          switch (this.cutName) {
            case 'jsj':
              this.KinsonBuyRecord()
              break
            case 'dt':
              this.regularPutInRecord()
              break
            case 'sp':
              this.shoppingRecord()
              break
          }
        }
      },
      regularPutInRecord: function () {
        this.$http.post(API.regularPutInRecord, {
          userId: this.$cookie.get('id'),
          nextPage: this.nextPage,
          pageSize: 5
        }).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            if (this.cutName === 'dt') {
              this.goodsData = result.object
            }
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      },
      shoppingRecord: function () {
        this.$http.post(API.shoppingRecord, {
          userId: this.$cookie.get('id'),
          nextPage: this.nextPage,
          pageSize: 5
        }).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            if (this.cutName === 'sp') {
              this.goodsData = result.object
            }
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      },
      KinsonBuyRecord: function () {
        this.$http.post(API.KinsonBuyRecord, {
          userId: this.$cookie.get('id'),
          nextPage: this.nextPage,
          pageSize: 5
        }).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            if (this.cutName === 'jsj') {
              this.goodsData = result.object
            }
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      },
      toOrderConfirm: function (a, b, c, d) {
        var orderObject = {
          orderNo: a,
          createTime: b,
          orderPrice: c,
          isRenew: d
        }
        this.$cookie.set('orderObject', JSON.stringify(orderObject))
        this.$router.push({'name': 'orderConfirm', params: {style: 'sp'}})
      },
      cancelOrder: function (orderNo) {
        this.$http.post(API.cancelOrder, {
          orderNo: orderNo,
          orderType: 2
        }).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            this.shoppingRecord()
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      },
      toTrack: function (a, item) {
        this.$cookie.set('sp', JSON.stringify(item))
        this.$router.push({name: 'track', params: {orderNo: a}})
      },
      tojsjDetail: function (id) {
        this._parentThis.titHtml = '<span>购买记录 > <span>金生金</span> > <span style="color: #f48315;">金生金详情</span></span>'
        this.$router.push({name: 'moreJSJDetail', params: {jsjId: id}})
      },
      toComment: function (index) {
        this.$router.push({name: 'comment', params: {commentData: this.goodsData.content[index]}})
      },
      toMorezcJsj: function () {
        this.showServerAgreement = false
        this._parentThis.titHtml = '<span>购买记录 > <span>转存</span> > <span style="color: #f48315;">金生金列表</span></span>'
        this.dtCutName = 'morezcJsj'
      },
      toMoreDingTouDetail: function (data) {
        this._parentThis.titHtml = '<span>购买记录 > <span>定投</span> > <span style="color: #f48315;">定投详情</span></span>'
        this.$cookie.set('dt_detail', JSON.stringify(data))
        this.$router.push({name: 'moreDingTouDetail'})
      },
      toTqList: function () {
        this.$cookie.set('moreTqData', JSON.stringify({
          style: 'dt',
          weight: this.goodsData.extractGold
        }))
        this.$router.push({name: 'tqList'})
      }
    },
    mounted: function () {
      this._parentThis.titHtml = '<span>购买记录 > <span style="color: #f48315;">商城</span></span>'
      var handleObj = this.$cookie.get('handleObj')
      if (handleObj) {
        this.cut(handleObj)
        this.$cookie.delete('handleObj')
      }
      switch (this.cutName) {
        case 'jsj':
          this.KinsonBuyRecord()
          break
        case 'dt':
          this.regularPutInRecord()
          break
        case 'sp':
          this.shoppingRecord()
          break
      }
    }
  }
</script>
